<template>
	<view class="uni-tab-bar">
		<scroll-view id="tab-bar" class="uni-swiper-tab" scroll-x>
			<view v-for="(tab,index) in tabBars" :key="tab.id" :class="['swiper-tab-list',tabIndex==tab.id ? 'active' : '']" :id="tab.id"
			 :data-current="tab.id" @click="tapTab(tab.id)">{{tab.title}}</view>
		</scroll-view>
		<scroll-view class="list" scroll-y @scrolltolower="loadMore(tabIndex)">
			<view class="joe-game-box">
				<joe-game-list @onStart="bindStart" @onDown="bindDownGame" v-model="gameList"></joe-game-list>
			</view>
		</scroll-view>
	</view>
</template>
<script>
	import joeGameList from "@/components/joe-game/game-list.vue"
	import {api_group_list,api_game_list,api_game_paly,api_down_game} from '@/api/index.js';
	import service from "@../../service"
	export default {
		components: {
			joeGameList
		},
		data() {
			return {
				//游戏分类
				tabBars: [],
				tabIndex: 0,
				gameList: [],
				game: [],
				page:1,
				rows:10,
				loadingText: {
					contentdown: "上拉显示更多",
					contentrefresh: "正在加载...",
					contentnomore: "没有更多数据了"
				}
			}
		},
		onLoad: function(option) {
		
			//获取分组
			api_group_list().then(res => {
				this.tabBars = res.data.data
				this.tabIndex = this.tabBars[0].id//选中默认分组
				api_game_list(this.tabIndex,this.page,this.rows).then(res => {
					this.gameList = res.data.data.list
				})
			})

		},
		methods: {
			//分组点击事件
			async tapTab(index) { //点击tab-bar
				this.page = 1
				this.tabIndex = index;
				api_game_list(index,this.page,this.rows).then(res => {
					this.gameList = res.data.data.list
				})
			},
			//下拉到底部触发事件
			loadMore(tabIndex) {
				uni.showToast({
					title: '数据加载中'
				});
				this.page++
				api_game_list(tabIndex,this.page,this.rows).then(res => {
					//this.gameList = res.data.data.list
					let list = res.data.data.list
					list.forEach((item,index)=>{
						this.gameList.push(item)
					})
					//this.gameList.push(res.data.data.list)
				})
			},
			bindStart(e){
				let member_id = service.getUsers().member_id
				api_game_paly(member_id,e.game_id).then(res=>{
					let play = escape(res.data.data.url)
					uni.navigateTo({
						url: '../game/game-play?gamePlay=' +  play
					})
				})
			},
			//游戏下载
			bindDownGame(game) {
				let member_id = service.getUsers().member_id
				api_down_game(game.game_id, member_id).then(res => {
					uni.navigateTo({
						url: '../game/game-play?type=down&gamePlay=' + escape(game.url)
					})
				})
			},
		}
	}
</script>
<style>
	.joe-game-box {
		padding: 15upx;
	}
</style>
